<template>
	<view class="my-promotion">
		<!-- #ifdef H5 -->
		<view class="head_box" style="background-color: initial">
			<cu-custom :isBackSecond="true">
			</cu-custom>
		</view>
		<!-- #endif -->
		<view class="header">
			<view class="topView">
				<view class="item">
					<text>今日统计</text>
					<text>{{ todayPrice }}</text>
				</view>
				<view class="item">
					<text>累计积分</text>
					<text>{{ totalPrice }}</text>
				</view>
				<view class="item">
					<text>可用积分</text>
					<text>{{ Info.lastDayCount }}</text>
				</view>
			</view>
		</view>
		<view class="listView">
			<view class="item" @click="goProfitDetails()">
				<text class="iconfont icon-qiandai left color_v1"></text>
				<text class="title">账单</text>
				<text class="iconfont icon-up right"></text>
			</view>
			<!-- <view class="item" @click="goPrize()">
				<text class="iconfont icon-tongji left color_v2"></text>
				<text class="title">月管理奖</text>
				<text class="iconfont icon-up right"></text>
			</view> -->
			<view class="item" @click="toCash()">
				<text class="iconfont icon-chongzhi left color_v4"></text>
				<text class="title">提现</text>
				<text class="iconfont icon-up right"></text>
			</view>
			<view class="item" @click="goCashRecord()">
				<text class="iconfont icon-dingdan left color_v5"></text>
				<text class="title">提现记录</text>
				<text class="iconfont icon-up right"></text>
			</view>
			 <view class="item" @click="getUserInfo()">
				<text class="iconfont icon-jiantou_shangxiaqiehuan_o rotateView left color_v3"></text>
				<text class="title">积分转账</text>
				<text class="iconfont icon-up right"></text>
			</view> 
		</view>
		<!-- #ifdef H5 -->
		<!-- <view class="footer">
			<view class="item" @click="home">
				<text class="iconfont icon-shouye"></text>
				<text class="title">首页</text>
			</view>
			<view class="item">
				<text class="iconfont icon-ziyuan-xianxing active"></text>
				<text class="title">店铺收益</text>
			</view>
			<view class="item" @click="BackPage">
				<text class="iconfont icon-yonghu"></text>
				<text class="title">个人中心</text>
			</view>
		</view> -->
		<!-- #endif -->
	</view>
</template>
<script>
	import {
		getSpreadInfo,
		getUserInfo,
		getUserIntegral
	} from "@/api/user";
	import {
		systemPrompt,
		interval
	} from '@/utils'
	export default {
		name: "UserPromotion",
		components: {},
		props: {},
		data: function() {
			return {
				Info: {
					lastDayCount: 0
				},
				id: 0,
				todayPrice: 0,
				totalPrice: 0,
				userInfo: {},
				dataLoing: false
			};
		},
		mounted: function() {
			this.getInfo();
			this.getUser();
			this.UserIntegral();
			this.id = this._route.query.id;
		},
		methods: {
			goRecharge() {
				this.$yrouter.push("/pages/user/Recharge/index");
			},
			goCashRecord() {
				if(this.dataLoing){
					this.$yrouter.push("/pages/user/promotion/CashRecord/index");
				}
			},
			goPrize() {
				if(this.dataLoing){
					if(this.userInfo.level < 4 || this.userInfo.isOpenCrown == 'N'){
						uni.showModal({
							title: '提示',
							content: '身份达到 "联营公司1" 才能参与分红',
							success: function(res) {
								if (res.confirm) {
									console.log('点击确定')
								} else if (res.cancel) {
									console.log('点击取消')
								}
							}
						});
					}else{
						this.$yrouter.push("/pages/user/prize/index");
					}
				}
			},
			goProfitDetails() {
				if(this.dataLoing){
					this.$yrouter.push("/pages/user/CurrentAccount/index");
				}
			},
			UserIntegral(){
				getUserIntegral()
					.then(res => {
						console.log("统计数据：" + JSON.stringify(res.data))
						this.todayPrice = interval(res.data.todayPrice);
						this.totalPrice = interval(res.data.totalPrice);
					})
					.catch(error => {
						console.log(error)
					})
			},
			BackPage() {
				// #ifdef H5
				const pages = getCurrentPages()
				if (pages.length > 1) {
					uni.navigateBack(1)
					return;
				}
				//使用vue-router返回上一级
				let a = this.$router.go(-1)
				if (a == undefined) {
					//重新定向跳转页面
					uni.reLaunch({
						url: '/pages/home/index'
					})
				}
				return;
				// #endif
				uni.navigateBack(1)
			},
			home() {
				this.$yrouter.switchTab({
					path: "/pages/home/index"
				});
			},
			goPromoterOrder() {
				this.$yrouter.push("/pages/user/promotion/PromoterOrder/index");
			},
			getInfo: function() {
				let that = this;
				uni.showLoading({
					title: '努力加载中',
				})
				getSpreadInfo().then(
					res => {
						uni.hideLoading()
						that.dataLoing = true
						that.Info.lastDayCount = interval(res.data.lastDayCount);
						console.log('用户信息：' + res.data)
					},
					function(err) {
						uni.hideLoading()
						uni.showToast({
							title: err.msg || err.response.data.msg || err.response.data.message,
							icon: 'none',
							duration: 2000
						});
					}
				);
			},
			getUserInfo() {
				if(this.dataLoing){
					if(!this.userInfo.status){
						systemPrompt()
						return
					}
					this.$yrouter.push({
						path: "/pages/user/promotion/IntegralTransfer/index"
					});
				}
			},
			toCash: function() {
				if(this.dataLoing){
					this.$yrouter.push({
						path: "/pages/user/promotion/UserCash/index"
					});
				}
			},
			getUser() {
				getUserInfo().then(res => {
					this.userInfo = res.data
					console.log(this.userInfo)
				})
				.catch(error => {
					console.log('获取用户信息失败')
					reject('获取用户信息失败')
				})
			}
		}
	};
</script>
<style lang="less">
	.rotateView {
		-moz-transform: rotate(90deg);
		-webkit-transform: rotate(90deg);
		-o-transform: rotate(90deg);
		transform: rotate(90deg)
	}
	.my-promotion {
		.header {
			box-sizing: border-box;
			padding: 30rpx 30rpx 0 30rpx;

			.topView {
				display: table;
				width: 100%;
				table-layout: fixed;
				height: 140rpx;
				box-sizing: border-box;
				padding: 30rpx 0;
				border-radius: 8rpx;
				background-color: #ffffff;
				box-shadow: 2rpx 2rpx 20rpx #ddd;

				.item {
					display: table-cell;
					vertical-align: middle;
					text-align: center;

					text {
						display: block;
						text-align: center;
						color: #555555;
						font-size: 26rpx;
					}
					
				}

			}
		}
		
		.listView{
			width: 100%;
			box-sizing: border-box;
			padding: 0 30rpx;
			margin-top: 30rpx;
			.item{
				height: 100rpx;
				width: 100%;
				background-color: #FFFFFF;
				box-shadow: 2rpx 2rpx 20rpx #ddd;
				border-radius: 8rpx;
				position: relative;
				margin-bottom: 20rpx;
				.left{
					font-size: 60rpx;
					display: block;
					float: left;
					height: 100%;
					width: 100rpx;
					text-align: center;
					line-height: 100rpx;
				}
				
				.title{
					height: 100%;
					line-height: 100rpx;
					display: block;
					float: left;
					font-size: 30rpx;
				}
				
				.right{
					float: right;
					height: 100%;
					width: 50rpx;
					display: block;
					text-align: center;
					line-height: 100rpx;
					font-size: 30rpx;
				}
				
				.color_v1{
					color: #ff3334;
				}
				.color_v2{
					color: #39c;
				}
				.color_v3{
					color: #ff6a00;
				}
				.color_v4{
					color: #d83250;
				}
				.color_v5{
					color: #555555;
				}
			}
		}
		
		.footer {
			height: 140rpx;
			width: 100%;
			position: fixed;
			bottom: 0;
			left: 0;
			background-color: #FFFFFF;
			display: table;
			table-layout: fixed;
		
			.item {
				display: table-cell;
				vertical-align: middle;
				text-align: center;
				width: 33.3333333333333%;
				.iconfont {
					padding: 13rpx;
					border-radius: 100%;
					background-color: #0081FF;
					color: #FFFFFF;
				}
		
				.active {
					background-color: #d0114f;
				}
		
				.title {
					display: block;
					text-align: center;
					font-size: 30rpx;
					margin-top: 15rpx;
				}
		
			}
		}
	}

	.my-promotion .header .topView .item:nth-child(1) {
		border-right: #e8e8e8 solid 1rpx;
	}

	.my-promotion .header .topView .item:nth-child(2) {
		border-right: #e8e8e8 solid 1rpx;
	}

	.my-promotion .header .topView .item text:nth-child(1) {
		margin-bottom: 15rpx;
	}
</style>
